<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<!--
 * @projectDescription An HTML5 based previewer of local wiki pages
 * @link http://code.google.com/p/wikignpi
 * @author Bruno Santos
 * @license MIT License <http://www.opensource.org/licenses/mit-license.php>
 *
 * Based on http://code.google.com/p/wikiwym/source/browse/trunk/index-jquery.html :
 * @link http://code.google.com/p/wikiwym
 * @author Stephan Beal
 * @author Fabien M�nager
 *
 * Description
 *    For more information, see here: http://code.google.com/p/wikignpi/wiki/PreviewMyWikiLocally
 -->
<title>Offline Google Code wiki syntax preview/editor for testing local changes in wiki pages</title>

  <script src="http://code.jquery.com/jquery-1.5.2.min.js" type="text/javascript"></script>
  <script type="text/javascript" src="GoogleCodeWikiParser.min.js"></script>
  <link type="text/css" rel="stylesheet" href="GoCoWi-previewer.css" />
  <script type="text/javascript">
    var gcwp;
    var isCtrl = false;
    jQuery(document).ready(function() {
      jQuery.noConflict();
      jQuery('#targetURL').attr('value','http://code.google.com/p/wikignpi/wiki/');
      gcwp = new GoogleCodeWikiParser(true,true);
      gcwp.options.disableWarnings=true;
      gcwp.options.openURLSInNewWindow=true;
      updateView();
      jQuery('#textarea').keypress(function(event) {
        if (event.keyCode == 13) {
          //event.preventDefault();
          updateView();
        }
      });

      jQuery(document).keyup(function (e)
      {
        if(e.which == 17) isCtrl=false;
      });

      jQuery(document).keydown(function (e)
      {
        if(e.which == 17) isCtrl=true;
        if(e.which == 83 && isCtrl == true)
        {
          //run code for CTRL+S -- er, preview!
          updateView();
          return false;
        }
        else if(e.which == 82 && isCtrl == true)
        {
          //run code for CTRL+R -- ie, reload!
          loadFile();
          return false;
        }
      });
    });

    function updateView() {
      gcwp.options.wikiBaseURL=jQuery('#targetURL').attr('value');

      var c = jQuery('#textarea').attr('value');
      try {
        c = gcwp.parse(c)
        jQuery('#wikicontent').html(c);
      }
			catch(e) {
        alert("Exception while parsing wiki code:\n"+e);
      }
    }

    function loadFile() {
      var fpnn = jQuery('#filepathNname')[0];
      var fpnnsz = 0;
      if(fpnn.files)
      {
        if(fpnn.files.length>0)
        {
          try {
            if(fpnn.files.item(0).size) fpnnsz = fpnn.files.item(0).size;
            if(fpnn.files.item(0).fileSize) fpnnsz = fpnn.files.item(0).fileSize;
          }
          catch(e) {}
          if(fpnnsz>0)
          {
            var newText = fpnn.files.item(0).getAsText("utf-8");
            jQuery('#textarea').attr('value',newText);
            updateView();
          }
          else
          {
            alert('Invalid file.');
          }
        }
        else
        {
          alert('No file selected!');
        }
      }
      else
      {
        alert('Sorry, but it\'s not possible to load a file with this browser :(');
      }
    }
  </script>
  <script src="http://code-opensocial.googleusercontent.com/gadgets/js/rpc.js?c=1&amp;container=code"></script>
  <script type="text/javascript">
    //RPC still doesn't work :(

    function resizeIframeHandler(opt_height) {
      var elem = document.getElementById(this.f);
      if (!elem) return;
      if (!opt_height) {
        elem.style.height = undefined;
      }
      else {
        opt_height = Math.max(10, opt_height);
        elem.style.height = opt_height + 'px';
      }
    }
    gadgets.rpc.register("resize_iframe", resizeIframeHandler);

    gadgets.rpc.register('set_title', function(title) {
    var elem = document.getElementById(this.f + '_title');
    if (elem) {
      elem.innerHTML = gadgets.util.escape(title);
    }
    });
  </script>
</head>

<body>
	<table class="layout">
    <tr>
      <td class="layout" style="border-bottom: 1px solid #999; padding: 2px;">
        Copy/paste the wiki code in the textarea on the left, edit it, and
              click the button to update the preview on the right. It will also update each time
              you tap the ENTER key in the left-side editor.<br>
        You can also preview a <strong>local</strong> file. Editing is allowed but you <strong>cannot save the file!</strong>
        <br><strong>Hotkeys</strong>: <strong>Ctrl+S</strong> to preview now; <strong>Ctrl+R</strong> to reload file.
      </td>
      <td class="layout" style="border-bottom: 1px solid #999; padding: 2px; text-align:right;">
        Target URL (doesn't auto-update): <input type="text" value="" name="targetURL" id="targetURL" size="30"/>
      </td>
    </tr>
  </table>
  <table class="layout">
		<tr>
      <td style="border-bottom: 1px solid #999; padding: 2px;">
        Local file: <input type="file" onchange="loadFile()" value="" name="filepathNname" id="filepathNname" size="50"/>
      </td>
      <td style="border-bottom: 1px solid #999; padding: 2px; text-align:center; vertical-align:middle;">
        <button onclick="loadFile()" style="width: 100%;">Reload file</button>
      </td>
      <td style="border-bottom: 1px solid #999; padding: 2px; text-align:right; vertical-align:middle;">
        <button onclick="updateView()" style="width: 100%;"><strong>Update Preview</strong></button>
      </td>
    </tr>
  </table>
  <table class="layout">
		<tr>
			<td class="layout">
<textarea id="textarea" wrap="soft" rows="50" class="editor">
=[http://code.google.com/p/wikiwym Wikiwym] demonstration!=

  * *bold* _emphasized_ and *_bold emphasized ^SuperScript^!_*.
  * item 2 is ~~stricken~~
  * item 3 is *~~boldly stricken~~*
  * item 4 is _~~*stricken boldly with emphasis*~~_

|| *a* || *b* || *c*||
|| a2 || ~~b2~~ || c2||
|| *_a3_* || b3 || *~~c3~~*||

  # ~~item~~
  # _~~item~~_
  * item

Intentional errors:

  * *unterminated bold
  * unterminated _*italics*
  * unterminated ^sup
  * mis-terminated ,,sub,
  * unterminated ,,sub
  * [UnterminatedLink

(If those are NOT _all_ marked with errors, something is broken.)

*Happy Hacking!*

-- [http://wanderinghorse.net/home/stephan/ stephan beal]

[http://wanderinghorse.net/home/stephan/ http://wanderinghorse.net/home/stephan/stephan_beal_sylt_072006_small.jpg]
</textarea>
      </td>
		  <td id="wikicontent" class="layout"></td>
		</tr>
	</table>
</body>
</html>
